<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>3D composite scenario visualization</title>
    <link rel="stylesheet" href="css/animate.css">
    <link rel="stylesheet" href="./minemap.css">
    <script src="./minemap.js"></script>
    <link rel="stylesheet" href="./dist/index-en.css">
</head>
<body>

<div id="control-panel">
    <div id="title">Safety cloud service of a sensor</div>
    <div id="title-line"></div>

    <div class="info-card card-active animated" id="card0">
        <div class="num-within-wrap">
            <img src="texture/control-panel/img-1-selected.png" class="num-within">
        </div>
        <div class="info-title">
            Safety cloud service of a sensor
        </div>
        <img class="img-area" src="texture/control-panel/img-shigu.png">
        <div class="description">
            Increasingly serious traffic congestion, extremely severe weather, bad road conditions, complex road environment and other factors have a direct impact on driving safety. Combining map and dynamic traffic information with the vehicle-mounted sensor data source and the third party data sources such as traffic police and weather, the safety cloud service of a sensor can provide the safety pre-service for the owner and vehicle aided driving system to help to respond actively to the dangerous situation in front of the vehicle.
        </div>
    </div>

    <div class="info-card animated" id="card1">
        <div class="num-within-wrap">
            <img src="texture/control-panel/img-1-selected.png" class="num-within">
        </div>
        <div class="info-title">
        </div>
        <img class="img-area" src="texture/control-panel/img-shigu.png">
        <div class="description">
        </div>
    </div>

    <button id="next-card">
        Next
    </button>

    <button id="reset">
        Reset
    </button>

    <div id="num-panel">
        <!--<img src="texture/control-panel/img-1.png" class="seq-label num1">-->
        <img src="texture/control-panel/img-2.png" class="seq-label num2">
        <img src="texture/control-panel/img-3.png" class="seq-label num3">
        <img src="texture/control-panel/img-4.png" class="seq-label num4">

        <div class="seq-label-text text2">Traffic Accident</div>
        <div class="seq-label-text text3">Breaks down</div>
        <div class="seq-label-text text4">Wet road warning</div>
    </div>

</div>
</div>

<div id="map"
     style="background:url('texture/background/sky.gif');background-repeat: repeat;background-size: 1080px 576px;">
    <img id="biandao-icon" src="texture/shigu-biandao.png"
         style="">
    <img id="fly-button" src="texture/huhuai/icon-fly-start.png">
</div>
<script src="./dist/bundle-en.js"></script>
</body>
